<template>
    <div class="nav-item"
        @click="clickNavItem(index)"
    >{{item | replaceNumToChs}}</div>
</template>
<script>

    import {replaceNumToChs} from "@/filters/index";
    export default {
        name:"navItem",
        props:{
            item:String,
            index:Number,
            creInd:Number
        },
        filters:{
            replaceNumToChs
        },
        methods:{
            clickNavItem(){
                this.$emit("clickNavItem",this.index);
            }
        }
    }
</script>
<style scoped>
    .nav-item{
        width: 25%;
        text-align: center;
        cursor: pointer;
    }
    .nav-item.on{
        background-color:#000;
        color: #fff;
    }
</style>
